<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>列表</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css" />
    <script src="layui/layui.js"></script>
</head>


<body class="layui-layout-body">


<div class="layui-card">
    <div class="layui-card-header">查询条件</div>
    <div class="layui-card-body">



        <form class="layui-form" action="">

            <div class="layui-row layui-col-space10">
                <div class="layui-col-md1">
                    <select name="city"  lay-filter="jylx" >
                        <option value="">交易类型</option>
                        <option value="REFUND">退款</option>
                        <option value="PAY">支付</option>
                    </select>
                </div>
                <div class="layui-col-md1">
                    <select name="city" lay-filter="ywlx">
                        <option value="">业务类型</option>
                        <option value="ZJZF">诊间支付</option>
                        <option value="JZKCZ">就诊卡充值</option>
                        <option value="ZYYJ">住院押金</option>
                    </select>
                </div>
                <div class="layui-col-md2">
                    <input type="text"  id="outTradeNo" required lay-verify="required"
                           placeholder="支付平台订单号或退款单号" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-col-md3">
                    <input type="text" class="layui-input" id="test1">
                </div>
                <div class="layui-col-md1">
                    <button type="button" onclick="query()" class="layui-btn">查询</button>
                </div>
            </div>

        </form>

    </div>
</div>

<div class="layui-card">
    <div class="layui-card-header">列表</div>
    <div class="layui-card-body">
        <table id="demo"></table>
    </div>
</div>

<script>
    var table,laydate,form;
    var options;
    var whereData={};
    var $;

    var sdate='',edate='',tradeType="",businessType="";

    function fun_date(aa){
        let date1 = new Date(),
            time1=date1.getFullYear()+"-"+(date1.getMonth()+1)+"-"+date1.getDate();//time1表示当前时间

        let date2 = new Date(date1);
        date2.setDate(date1.getDate()+aa);

        let time2 = date2.getFullYear()+"-";
        if((date2.getMonth()+1)<10){
            time2+="0"+(date2.getMonth()+1);
        }else{
            time2+=""+(date2.getMonth()+1);
        }
        if(parseInt(date2.getDate())<10){
            time2+="-0"+date2.getDate();
        }else{
            time2+="-"+date2.getDate();
        }

        return time2;
    }

    layui.use(['form','table','laydate','jquery'], function(){
        table = layui.table;
        laydate = layui.laydate;
        form = layui.form;
        $ = layui.jquery;

        form.on('select(jylx)', function(data){
            tradeType=data['value'];
        });
        form.on('select(ywlx)', function(data){
            businessType=data['value'];
        });


        //执行一个laydate实例
        laydate.render({
            range: true,
            type: 'datetime',
            elem: '#test1',
            value:fun_date(-7)+' 00:00:00 - '+fun_date(0)+' 23:59:59',
            done: function(value, date, endDate){
                sdate=value.split(' - ')[0];
                edate=value.split(' - ')[1];
            }

        });

        options={
            elem: '#demo'
                ,height: 500
                ,totalRow:true
                //,data:[]
                ,contentType:"application/json"
                ,method:'POST'
                ,url: 'v1/api/send' //数据接口
                ,where:whereData
            ,parseData:function(res){

                var sum=0;
                var data=res['data'];
                if(data){
                    for (var i=0;i<data.length;i++){
                        sum+=parseFloat(data[i]['amount']);
                    }
                    sum=sum.toFixed(2);
                }


                var obj={
                    "code":(res['success'])?0:res['code'], //解析接口状态
                    "msg": res['msg'], //解析提示文本
                    "count":(data)?data.length:0, //解析数据长度
                    "data": data,
                    "totalRow": {
                        "outTradeNo": "合计",
                        "amount": sum
                    }
                };

                return obj;
            }
        ,page: false //开启分页
                ,cols: [[ //表头
                {checkbox: true,type:'radio'}
                ,{field: 'outTradeNo', title: '商户订单号', width:240, sort: true}
                ,{field: 'customName', title: '昵称', width: 120, sort: true}
                ,{field: 'payerName', title: '付款人姓名', width: 120,sort: true}
                ,{field: 'amount', title: '金额', width: 120, sort: true}
                ,{field: 'stateDes', title: '状态', width: 120,sort: true}
                ,{field: 'payTime', title: '支付时间', width:200,sort: true}
                ,{field: 'refundOrderNo', title: '退款号', width:200, sort: true}
                //,{field: 'sourceOutTradeNo', title: '原订单号', width:200,sort: true}
                ,{field: 'transactionId', title: '商户订单号', width: 200, sort: true}
            ]]
        };

        //第一个实例
        query();
    });

    function query() {
        whereData={
            "path":"prefront/reconciliation/query",
            "hospitalId":"0537_jnsgwzx",
            "startTime":sdate,
            "endTime":edate,
            "tradeType":tradeType,
            "businessType":businessType,
            "outTradeNo":$('#outTradeNo').val()
        };
        if(whereData['startTime']==''){
            whereData['startTime']=fun_date(-7)+' 00:00:00';
        }
        if(whereData['endTime']==''){
            whereData['endTime']=fun_date(0)+' 23:59:59';
        }

        options['where']=whereData;



        table.render(options);
    }

</script>
</body>
</html>
